<!DOCTYPE html>
<html lang="zh-cmn-Hans">
<head>
	<meta charset="UTF-8">
	<link rel="shortcut icon" href="favicon.ico">
	<link rel="stylesheet" href="css/iconfont.css">
	<link rel="stylesheet" href="css/global.css">
	<link rel="stylesheet" href="css/bootstrap.min.css">
	<link rel="stylesheet" href="css/bootstrap-theme.min.css">
	<link rel="stylesheet" href="css/swiper.min.css">
	<link rel="stylesheet" href="css/styles.css">
	<script src="js/jquery.1.12.4.min.js" charset="UTF-8"></script>
	<script src="js/bootstrap.min.js" charset="UTF-8"></script>
	<script src="js/swiper.min.js" charset="UTF-8"></script>
	<script src="js/global.js" charset="UTF-8"></script>
	<script src="js/jquery.DJMask.2.1.1.js" charset="UTF-8"></script>
	<title>XXX</title>
	<script src="js/vue.js"></script>
	<script src="js/axios.min.js"></script>
	<script src="js/layui/layui.js"></script>
	<script type="text/javascript">
		/* 注册layui */
		layui.use('layer', function () {
			var layer = layui.layer;
		});

		$(function(){
			new Vue({
				el: "#app",
				data: {
					order:{
					},
					orderId:"",
					paypwd:"",
					user:{}
				},
				methods:{

					confirmRec(){
						axios.post("http://192.168.6.125:8080/user/getUser",this.user).then(response=> {
							if (response.data.code==200) {
								if (this.paypwd===response.data.data.paypwd){
									axios.get("http://192.168.6.125:8080/order/confirm/"+this.order.id).then(response=> {
										if (response.data.code==200) {
											location.href="uconfrim_step4.html";
										}else{
											alert("错误:"+response.data.msg);
										}
									})
								}else {
									layer.alert('支付密码错误!', {
										shade: 0,
										icon: 5,
										skin: 'layer-ext-demo' //见：扩展说明
									})
									this.paypwd="";
								}
							}else{
								alert("错误:"+response.data.msg);
							}
						})
					},
				},
				mounted: function () {

					this.user = JSON.parse(localStorage.getItem("userz"));

					let url = location.search; //获取url中"?"符后的字串
					if(url.length>0) { //判断是否携带参数
						var params = {};
						if (url.indexOf('?') != -1) {
							this.isShwoInput = true;
							let str = url.substr(url.indexOf('?') + 1);
							let strs = str.split('&');
							for (let i = 0; i < strs.length; i++) {
								params[strs[i].split('=')[0]] = decodeURI(strs[i].split('=')[1]);
							}
						}
					}
					// return params;
					console.log(params);
					this.orderId = params.id;
					axios.get("http://192.168.6.125:8080/order/getById/"+params.id).then(response=> {
						if (response.data.code==200) {
							this.order = response.data.data;
						}else{
							alert("错误:"+response.data.msg);
						}
					})
				}
			});
		})
	</script>

</head>
<body>


				<div class="user-content__box clearfix bgf" id="app">
					<div class="title">订单中心-确认收货</div>
					<div class="order-info__box">
						<div class="step-flow-box" style="width: 800px;margin: 0 auto 24px">
							<div class="step-flow__bd">
								<div class="step-flow__li step-flow__li_done">
									<div class="step-flow__state"><i class="iconfont icon-ok"></i></div>
									<p class="step-flow__title-top">拍下商品</p>
								</div>
								<div class="step-flow__line step-flow__li_done">
									<div class="step-flow__process"></div>
								</div>
								<div class="step-flow__li step-flow__li_done">
									<div class="step-flow__state"><i class="iconfont icon-ok"></i></div>
									<p class="step-flow__title-top">付款</p>
								</div>
								<div class="step-flow__line step-flow__li_done">
									<div class="step-flow__process"></div>
								</div>
								<div class="step-flow__li step-flow__li_done">
									<div class="step-flow__state"><i class="iconfont icon-ok"></i></div>
									<p class="step-flow__title-top">卖家发货</p>
								</div>
								<div class="step-flow__line step-flow__line_ing">
									<div class="step-flow__process"></div>
								</div>
								<div class="step-flow__li">
									<div class="step-flow__state"><i class="iconfont icon-ok"></i></div>
									<p class="step-flow__title-top">买家确认收货</p>
								</div>
							</div>
						</div>
						<p class="fz18 cr">我已收到货，同意付款。</p>
						<div class="table-thead">
							<div class="tdf3">商品</div>
							<div class="tdf1">数量</div>
							<div class="tdf1">单价</div>
							<div class="tdf1">总价</div>
							<div class="tdf1">运费</div>
						</div>
						<div class="order-item__list" v-for="(item,index) in order.orderitems">
							<div class="item">
								<div class="tdf3">
									<a href="item_show.html"><div class="img"><img :src="item.goodsinfo.coverPath" alt="" class="cover"></div>
										<div class="ep2 c6">{{item.goodsinfo.descriptors}}</div></a>
									<div class="attr ep">颜色分类：深棕色  尺码：{{item.stock}}</div>
								</div>
								<div class="tdf1" v-if="order.status==4"><a href="order_evaluate.html">待评价</a><!-- 已确认收货 --></div>
								<div class="tdf1"  v-if="order.status==1"><a href="order_evaluate.html">待付款</a><!-- 待付款 --></div>
								<div class="tdf1" v-if="order.status==3"><a href="order_evaluate.html">待收货</a><!-- 待收货 --></div>
								<div class="tdf1" v-if="order.status==2"><a href="order_evaluate.html">待发货</a><!-- 待发货 --></div>
								<div class="tdf1" v-if="order.status==7"><a href="order_evaluate.html">已取消</a><!-- 已取消 --></div>



								<div class="tdf1">{{item.number}}</div>
								<div class="tdf1">¥{{item.price}}</div>
								<div class="tdf1">¥{{item.sum}}</div>
								<div class="tdf1">
									<div class="ep2">快递<br>¥0.00</div>
								</div>
							</div>


						</div>
					</div>
						<div class="price-total">
							<div class="fz18 c6">实付款：<b class="cr">¥{{order.payMoney}}</b></div>
						</div>
						<hr>

						<div class="order-info">
							订单编号：<span class="c6">{{order.orderNo}}</span><br>
							收货地址：<span class="c6">{{order.name}}，{{order.phone}}，{{order.address}}</span><br>
							成交时间：<span class="c6">2017-09-07 16:03:07</span>
						</div>


						<div class="modify_div clearfix">
							<form action="" class="user-setting__form" role="form">
								<ul class="fz12 text-nowrap">
									<li class="cr">◆ 请收到货后，再确认收货！否则我们可能无法为您保障权益！</li>
									<li class="c6">◆ 如果您想申请退款，<a href="udai_apply_return.html">请点击这里</a></li>
								</ul>
								<div class="form-group">
									<input class="form-control" v-model="paypwd" name="phone" required="" maxlength="11" autocomplete="off" type="password">
									<span class="tip-text">支付密码</span>
									<span class="error_tip"></span>
								</div>
								<div class="form-group" style="line-height: 1em">
									<div class="col-sm-offset-2 col-sm-10">
										<button type="button" @click="confirmRec" class="but">确认已收货</button>
									</div>
								</div>
							</form>
						</div>
					</div>

</body>
</html>